<template>
  <div class="wrapper">
    <!-- <video src="./assets/video.mp4"></video> -->
    <div class="nav" v-if="$route.path !== '/login'">
      <div class="left">
        <img src="./assets/haluo.png" alt="" @click="$router.push('/about')" />
      </div>
      <div class="right">
        <div class="word">
          <div class="item" @click="$router.push('/cycle')">我要用车</div>
          <div class="item" @click="$router.push('/order')">我的订单</div>
          <div class="item" @click="$router.push('/repair')">我要报修</div>
          <div class="item" @click="$router.push('/complaint')">我要投诉</div>
          <div class="item" @click="$router.push('/mine')">个人资料</div>
        </div>
      </div>
    </div>
    <RouterView />
  </div>
</template>
<script>
import { RouterLink, RouterView } from 'vue-router'
export default {
  data() {
    return {
      theme: 'light'
    }
  }
}
</script>

<style scoped lang="scss">
.wrapper {
  width: 100%;
  height: 100%;
  background-color: rgba($color: #000000, $alpha: 0.6);
}
video {
  position: absolute;
  z-index: -1;
  width: 100%;
  overflow: hidden;
}
.nav {
  display: flex;
  justify-content: space-evenly;
  color: #ffffff;
  font-size: 18px;
  padding: 5px 0;
  margin-bottom: 30px;
  .left {
    // flex: 1.5;
    cursor: pointer;
    .img {
      cursor: pointer;
    }
  }
  .right {
    display: flex;
    align-items: center;
    .word {
      font-family: PingFangSC-Regular, PingFangSC-Light, 'Microsoft YaHei', Arial, Helvetica,
        'Hiragino Sans GB', STXiHei, sans-serif;
      display: flex;
      align-items: center;
      width: 100%;
      .item {
        margin: 0 30px;
        cursor: pointer;
      }
    }
  }
}
</style>
